<transition name="moves">
    <div v-show="flag" class="add-info operate-way">
        <div class="title-info">
            <h4 class="app-title">
                <span @click="hide"><i class="icon-left back"></i></span>
                {{$t('location')}}
            </h4>
        </div>
        {{list}}
        <div class="register-wrapper">
            <div>
                <el-select
                        v-model="value10"
                        filterable
                        allow-create
                        default-first-option
                        placeholder="请选择文章标签">
                    <el-option
                            v-for="item in floorArray"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </div>
            <a class="mint-cell mint-field">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title">
                        <span class="mint-cell-text">{{$t('area')}}</span>
                    </div>
                    <div class="mint-cell-value">
                        <input type="text" v-model="area" class="mint-field-core">
                        <div @click="selectArea" class="cell-down">
                            <i class="icon-right"></i>
                        </div>
                    </div>
                </div>
            </a>
            <a class="mint-cell mint-field">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title">
                        <span class="mint-cell-text">{{$t('code')}}</span>
                    </div>
                    <div class="mint-cell-value">
                        <input type="text" v-model="serialNum" class="mint-field-core">
                    </div>
                </div>
            </a>
            <a class="mint-cell mint-field">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title">
                        <span class="mint-cell-text">MAC</span>
                    </div>
                    <div class="mint-cell-value">
                        <input type="text" :placeholder="$t('macDesc')" v-model="mac" class="mint-field-core">
                        <span @click="setScanner" class="scanner"><i class="icon-scanner"></i></span>
                    </div>
                </div>
            </a>
            <div v-show="!showEdit" class="position-relative btn-register-wrapper">
                <button type="submit" class="btn register-btn margin-top-15" @click="savePair">{{$t('nextStep')}}</button>
            </div>
            <div v-show="showEdit" class="position-relative btn-register-wrapper">
                <button type="submit" class="btn register-btn margin-top-15" @click="editPair">{{$t('editBtn')}}</button>
            </div>
        </div>
        <transition name="ups">
            <div v-show="showFloor" class="operate-wrapper">
                <div @click="hideFloor" class="mask"></div>
                <div class="operate-info info-content">
                    <mt-picker :slots="slots1" @change="onFloorChange"></mt-picker>
                </div>
            </div>
        </transition>
        <transition name="ups">
            <div v-show="showArea" class="operate-wrapper">
                <div @click="hideArea" class="mask"></div>
                <div class="operate-info info-content">
                    <mt-picker :slots="slots2" @change="onAreaChange"></mt-picker>
                </div>
            </div>
        </transition>
    </div>
</transition>